<!--
 * @Author: ChunLai
 * @Date: 2023-07-26 10:10:50
 * @LastEditTime: 2025-11-19 13:59:33
 * @Description: 险种计划展示模块
 * @FilePath: \01.latest-short-insure\src\components\RiskPlanModule.vue
-->
<template>
  <div class="risk_plan_mode">
    <div class="flex-lr mode1">
      <span class="mode1_l">产品信息</span>
      <span class="mode1_r">
        首年总保费：<b>{{ totalFee }}</b> 元
      </span>
    </div>
    <div class="mt10">
      <RiskTable></RiskTable>
    </div>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
import { GetRiskData } from "@/translate/risks/insert.js";
export default {
  name: "RiskPlanModule",
  props: {
    cashShow: {
      type: Boolean,
      default: () => false,
    },
  },
  data() {
    return {};
  },
  components: {},
  computed: {
    ...mapGetters({
      totalFee: "insert/totalPrem",
      recall: "insert/recall",
      riskInfo: "risks/showedRisks",
    }),
  },
  watch: {},
  created() {},
  mounted() {
    // 页面刷新/人脸识别回跳/跳转签名回跳,getVarietyInfo接口会初始化险种信息
    try {
      if (this.recall == "1") {
        this.reBackRiskApiInfos();
      }
    } catch (error) {
      console.log(error);
    }
  },
  methods: {
    reBackRiskApiInfos() {
      this.$store.commit("insert/SET_RECALL", "0");
      this.$store
        .dispatch("apis/getBillDetails", this.apiComParams)
        .then((data) => {
          let { cont, insureds } = data;
          if (cont && cont.totalPrem) {
            this.$store.commit("insert/UPDATE_PAYINFO", {
              totalPrem: cont.totalPrem,
            });
          }
          if (insureds && insureds[0]) {
            let risks = insureds[0].risks || [];
            if (risks.length > 0) {
              let risk = GetRiskData(risks);
              this.$store.commit("risks/SET_RISKS_DATA", risk);
              this.$store.dispatch("risks/setRisks", {});
            }
          }
        });
    },
  },
};
</script>

<style lang="less" scoped>
.risk_plan_mode {
  padding: 0 12px 10px;
  background-color: #fff;

  .mode1 {
    padding-top: 12px;
    padding-bottom: 6px;

    .mode1_l {
      font-size: 16px;
      font-weight: 600;
      color: #242424;
      line-height: 22px;
      font-family: MiSans;
    }

    .mode1_r {
      font-size: 12px;
      color: #747474;
      line-height: 22px;

      b {
        font-size: 17px;
        font-weight: 600;
        color: #d44438;
      }
    }
  }

  .mode_renew {
    padding-left: 9px;

    .renew_name {
      color: #343434;
      font-size: 15px;
      font-weight: 600;
    }

    .renew_list {
      font-size: 14px;
      font-weight: 400;
      line-height: 1.5;
      color: rgba(116, 116, 116, 1);
      margin-top: 6px;
    }
  }
}
.cash_box {
  display: flex;
  justify-content: flex-end;
}
</style>
